<template>
  <div class="details">
    <div>sync语法讲解</div>
    <myComponent 
     :show="valueChild"
     v-on:update:show="newValue=>valueChild = newValue"
    style="padding: 30px 20px 30px 5px;border:1px solid #ddd;margin-bottom: 10px;"></myComponent>
    <button @click="changeValue">toggle</button>
  </div>
</template>

<script>
    import MyComponent from '@/components/MyComponent'

 export default {
     components:{
        MyComponent
     },
   data () {
     return {
        valueChild: false
     }
   },
   methods: {
        changeValue() {
          this.valueChild = !this.valueChild
        },
        updateShow(newValue){
            console.log('newValue: ' + newValue);
            this.valueChild = newValue;
        }
   }
 }
</script>

<style scoped>

 
</style>
